<template>
	<view>
		<!-- <view class="btn" @click="enterRoom()">开启录制</view> -->
		<!-- <view class="btn" @click="destroyInstance()">销毁</view> -->
		<view class="btn" :animation="animationData"></view>
		<view class="btnConter">
			<!-- <view class="yuan"></view>
			<view class="yuan1"></view>
			<view class="yuan2"></view>
			<view class="yuan3"></view> -->
		</view>

		<view class="btnConterText" @click="enterRoom()">{{title}}</view>
	</view>
</template>

<script>
	import permision from "@/common/permission.js"
	import TrtcCloud from '@/TrtcCloud/lib/index';  //引入腾讯云 TRTC 的核心 SDK 封装
	import {
		TRTCAppScene,//定义应用场景（如 VIDEOCALL 视频通话、LIVE 直播）
		TRTCVideoStreamType,//视频流类型（如主流 Big 或辅流 Small）
		TRTCAudioRoute,//音频路由（如听筒 Earpiece 或扬声器 Speakerphone）
		TRTCAudioQuality,
		TRTCVideoResolution,//视频分辨率（如 360P、720P）和模式（横屏/竖屏）
		TRTCVideoResolutionMode,//视频分辨率（如 360P、720P）和模式（横屏/竖屏）
		TRTCVideoEncParam //视频编码参数（码率、帧率等）
	} from '@/TrtcCloud/lib/TrtcDefines';  //引入 TRTC 的枚举常量，用于配置音视频参数。
	import genTestUserSig from '@/debug/GenerateTestUserSig';//引入生成 TRTC 用户签名（UserSig）的工具
	import TrtcLocalView from '@/TrtcCloud/view/TrtcLocalView';//引入 TRTC 的本地和远程视频渲染组件，显示本地摄像头采集的画面。
	import TrtcRemoteView from '@/TrtcCloud/view/TrtcRemoteView';//引入 TRTC 的本地和远程视频渲染组件，显示远端用户的视频流。
	import {
		mapState
	} from 'vuex';
	export default {

		data() {
			return {
				animationData: {},
				animationData1: {},
				animationData2: {},
				trtcCloud: null,
				sdkAppId: 0,
				userSig: '',
				// roomId: Math.floor(Math.random() * 100000),
				roomId: '',
				userId: '',
				appScene: TRTCAppScene.TRTCAppSceneVideoCall, // TRTCAppSceneVideoCall
				isFrontCamera: true,
				streamType: TRTCVideoStreamType.TRTCVideoStreamTypeBig,
				remoteUserId: '',
				audioRoute: TRTCAudioRoute.TRTCAudioRouteSpeaker,
				remoteAudioMuteState: false,
				localAudioMuteState: false,
				localVideoMuteState: false,
				title: '开始问诊'
			}
		},
		computed: {
			...mapState(['user'])
		},
		onLoad(e) {
			console.log("页面传值", e)
			console.log(this.user)
			// this.roomId = '42096bb1dc684f59a349b644ba5c1288'
			// this.userId =this.user.id
			// this.initClick(e.order_id, e.type)
			// this.initClick(e.id)
			this.doctor_id = e.id
			if (e.name) {
				this.title = e.name;
				uni.setNavigationBarTitle({
					title: e.name
				})
			}
		},
		mounted() {
			//如果是安卓平台
			if (uni.getDeviceInfo().platform === 'android') {
				permision.requestAndroidPermission('android.permission.RECORD_AUDIO');// 申请录音权限
				permision.requestAndroidPermission('android.permission.CAMERA');// 申请相机权限
				//如果是IOS平台
			} else if (uni.getDeviceInfo().platform === 'ios') {
				permision.judgeIosPermission('camera')// 检查/申请摄像头权限
				permision.judgeIosPermission('record')// 检查/申请麦克风权限
			}
		},
		onShow() {
			var animation = uni.createAnimation({
				duration: 1000,
				timingFunction: 'linear',
			})
			var animation1 = uni.createAnimation({
				duration: 1000,
				timingFunction: 'linear',
			})
			var animation2 = uni.createAnimation({
				duration: 1000,
				timingFunction: 'linear',
			})
			this.animation = animation
			this.animation1 = animation1
			this.animation2 = animation2
			setInterval(function() {
				// animation2.translate3d(20,20,20).setp()
				animation1.scale(1.1, 1.1).step()
				animation1.scale(1, 1).step()
				animation.scale(1.2, 1.2).step()
				animation.scale(1, 1).step()
				this.animationData = animation.export()
				this.animationData1 = animation1.export()
				// this.animationData2 = animation2.export()
			}.bind(this), 1000)
		},
		methods: {
			// async initClick(id, type) {
			async initClick(id) {
				var that = this
				// setTimeout(() => {
				// 	that.show = false;
				// }, 3000)

			},
			enterRoom() {
				const res = uni.getAppAuthorizeSetting()//获取当前应用的权限状态
				console.log("getAppAuthorizeSetting", res)
				if (res.cameraAuthorized != 'authorized' || res.microphoneAuthorized != 'authorized') {
					// console.log("reeeee", res)
					if (uni.getDeviceInfo().platform === 'android') {
						permision.requestAndroidPermission('android.permission.RECORD_AUDIO');
						permision.requestAndroidPermission('android.permission.CAMERA');
					} else if (uni.getDeviceInfo().platform === 'ios') {
						permision.judgeIosPermission('camera')
						permision.judgeIosPermission('record')
					}
					return;
				}
				uni.request({
					url: '/Trtc/init',
					method: 'post',
					data: {
						doctor_id: this.doctor_id,
						type: "consultation",
						order_id: ''
						// type: type
					},
					success: res => {
						console.log("res", res)
						// this.roomId = res.data.room_id
						// this.userId = this.data.user_id
						uni.navigateTo({
							url: '/pages/common/rtmp/plugFlowNew?userId=' + res.data.user_id + '&roomId=' +
								res.data.room_id + '&type=user'
							// url: '/pages/common/rtmp/plugFlowNew?userId=' + res.data.user_id + '&roomId=10'
						})
					}
				});

			}

		}
	}
</script>

<style>
	.btn {
		width: 276rpx;
		height: 276rpx;
		background: #C7F1D1;
		position: fixed;
		top: 0;
		left: 0;
		margin: auto;
		bottom: 0;
		right: 0;
		border-radius: 100%;
	}



	.btnConter {
		position: fixed;
		top: 0;
		left: 0;
		margin: auto;
		bottom: 0;
		right: 0;
		width: 228rpx;
		height: 227rpx;
		padding-top: 1rpx;
		background: #B3EAC0;
		border-radius: 100%;
		animation: myRotate 10s linear infinite;
	}

	.yuan {
		width: 20rpx;
		height: 20rpx;
		background: #4CBD66;
		border-radius: 100%;
		float: left;
		margin-left: 104rpx;
		margin-top: -10rpx;
	}

	.yuan1 {
		width: 20rpx;
		height: 20rpx;
		background: #4CBD66;
		border-radius: 100%;
		float: left;
		margin-left: -134rpx;
		margin-top: 104rpx;

	}

	.yuan2 {
		width: 20rpx;
		height: 20rpx;
		background: #4CBD66;
		border-radius: 100%;
		float: left;
		margin-left: 218rpx;
		margin-top: 104rpx;
	}

	.yuan3 {
		width: 20rpx;
		height: 20rpx;
		background: #4CBD66;
		border-radius: 100%;
		float: left;
		margin-left: 104rpx;
		margin-top: 80rpx;
	}

	@keyframes myRotate {
		0% {
			transform: rotate(0);
		}

		100% {
			transform: rotate(360deg);
		}
	}

	.btnConterText {
		position: fixed;
		top: 0;
		left: 0;
		margin: auto;
		bottom: 0;
		right: 0;
		width: 176rpx;
		height: 176rpx;
		background: #4CBD66;
		border-radius: 100%;
		/* margin: 24rpx auto; */
		line-height: 176rpx;
		text-align: center;
		font-size: 30rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		font-weight: bold;
		color: #FFFFFF;
	}
</style>